<template>
  <div>
    <div class="gl_contentBox gl_heightFull">
      <el-tabs v-model="activeName" type="card" class="gl_tabs" @tab-click="handleTabClick">
        <template v-for="item in feeList">
          <el-tab-pane :key="item.code" :name="item.code" :label="item.name">
            <component :is="item.component" v-if="item.code === activeName" />
          </el-tab-pane>
        </template>
      </el-tabs>
    </div>
  </div>
</template>

<script>
import sellLessonRecord from './sellLessonRecord.vue';
import activationRecord from './activationRecord.vue';
export default {
  data () {
    return {
      activeName: 'activationRecord',
      feeList: [
        {
          code: 'activationRecord',
          name: '激活操作纪录',
          component: activationRecord
        },
        {
          code: 'sellLessonRecord',
          name: '销课纪录',
          component: sellLessonRecord
        }
      ]
    };
  },
  methods: {
    handleTabClick(tabItem) {
      this.activeName = tabItem.paneName;
    }
  }
};
</script>

<style lang="scss" scoped>

</style>
